<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/common/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
<title>系统首页</title>
<link rel="stylesheet" type="text/css" href="${ctx}/easyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="${ctx}/easyui/easyui_my.css">
<link rel="stylesheet" type="text/css" href="${ctx}/easyui/themes/icon.css">
<link rel="stylesheet" type="text/css" href="${ctx}/css/css.css" />

<script type="text/javascript" src="${ctx}/js/jquery-1.7.min.js"></script>
<script type="text/javascript" src="${ctx }/easyui/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript" src="${ctx }/js/highcharts/highcharts.js"></script>
<script type="text/javascript" src="${ctx }/js/highcharts/modules/exporting.js"></script>
<script type="text/javascript">
var tjld = "2";//3:月，1:日，2:周
$(function(){
	$(".timeshijian1 a").click(function() {
	$(".timeshijian1 a").removeClass("yuanqiuding");
		$(this).addClass("yuanqiuding");
	}); 
	hometjld(tjld);
	//curentTime();
});
</script>
<style>
.dashujutable_nr2{ background:#f1f1f1;color:#5e5e5e;}
.dashujutable_top {
	background: #ebebeb; font-weight:bold;
	border-bottom: 1px solid #bbbbbc;
	border-top: 1px solid #bbbbbc;
	color: #444444;
}
</style>
</head>
<script type="text/javascript">
function hometjld(tjld){
	initcjtj(tjld);
	biaogeDiv(tjld);
	//initwfsx(tjld);
	//initwfcj(tjld);
	//initwfsh(tjld);
	//initwfrk(tjld);
	//gcwfDiv(tjld);
}
function curentTime() {
	var now = new Date();
	var year = now.getFullYear(); //年
	var month = now.getMonth() + 1; //月
	var day = now.getDate(); //日
	var hh = now.getHours(); //时
	var mm = now.getMinutes(); //分
	var ss = now.getSeconds();//秒
	var clock = year + "-";
	if (month < 10)
		clock += "0";
	clock += month + "-";
	if (day < 10)
		clock += "0";
	clock += day + " ";
	if (hh < 10)
		clock += "0";
	clock += hh + ":";
	if (mm < 10)
		clock += '0';
	clock += mm + ":";
	if (ss < 10)
		clock += '0';
	clock += ss;
	$("#myDate").html(clock);
}
</script>
<body> 
<!--系统头部中间内容区域strat-->
<div class="dashujumain">
      <div class="dashujumain_limian">
          <div class="dashujumain_limian_left">
             <div class="leftfangge" style=" height:700px;">
             	    <div class="tesgu_top">
             			<!-- <p class="timeshijian"><i id = "myDate"></i>2015-09-12&nbsp;&nbsp;&nbsp;&nbsp;12：50：36</p> -->
                        <p class="timeshijian1">
                        	<a href="###"  onclick="hometjld('3')">月</a>
                        	<a href="###" class="yuanqiuding" onclick="hometjld('2')">周</a>
                        	<a href="###"  onclick="hometjld('1')">天</a>
                       	</p>
     			    </div>
              			<div class="sipangloyudsdwecxwaimiandsj" style="padding: 0 0 0 6%;width: 94%;">
	                        <!--饼图-->	
						 <%-- 	<jsp:include page="home/bingtuDiv.jsp" /> --%>
						 <div class="sipangloyudsdwecx" style="border-bottom:1px solid #dadada; border-right:1px solid #dadada;">
							<div id="wfsx" style="height: 100%;width: 100%"></div>
							</div>
							<div class="sipangloyudsdwecx" style="border-bottom:1px solid #dadada;">
										<div id="wfcj" style="height: 100%;width: 100%"></div>
						</div>
           				</div>
                   <div class="xinjiabiaogeshiyong" style="margin:14px 0 0 14px; display:inline;">
                    	<!--过车记录-->	
					  <jsp:include page="home/biaogeDiv.jsp" />
						
					 	<!--过车记录-->
                  </div>
    			</div>
          </div>
          <div class="dashujumain_limian_right">
          	<!--过车违法-->	
			<%-- <jsp:include page="home/gcwfDiv.jsp" /> --%>
			<!--过车违法-->
           	<!--布控报警-->	
			<%-- <jsp:include page="home/shishiDiv.jsp" /> --%>
			<!--布控报警-->
			<div class="rightfangge">
				<div class="tongyi_top">
		  			<a href="###" class="gengduob" onclick="skipTocjtj();">更多</a>
				</div>
		        <div class="tongyi_zhongjiantu1">
		        	<%-- <img id="imggc1" onerror="javascript:this.src='${ctx}/images/dfsdfw2ww.jpg'" 
						style="width: 100%;height: 100%" onclick="showDetailPic(this.src)"> --%>
						<div id="container2" style="height: 100%;width: 100%"></div>
				</div>
		        <table id="InfoTable1" border="0" cellpadding="0" cellspacing="0" width="100%" class="dashujutable" style="margin:12px 0 18px;padding: 0 10px;">
		        	<thead>
		                 <tr>
		                   <td height="26" align="center" class="dashujutable_top">单位名称</td>
		                   <td align="center" class="dashujutable_top">待采集数</td>
		                   <td align="center" class="dashujutable_top">已审核数</td>
		                   <td align="center" class="dashujutable_top">下载待审核数</td>
		                   <td align="center" class="dashujutable_top">需重新采集数</td>
		                 </tr>
		             </thead>
		             <tbody>
		             </tbody>
		       </table>
          </div>
          </div>
      </div>
</div>
<script type="text/javascript">
function skipTocjtj(){
	parent.addTab("采集统计","${ctx }/cxtj/cjtj.htm"); 
}
function initcjtj(tjld){
	 $.ajax({
		url:'${ctx}/homebt/cjcount.htm',
		type:'POST',
		dataType:'json',
		data:{
			tjld:tjld
		},
		success:function(data, textStatus, jqXHR){
			initHighCharts(data);//采集数据统计
			initHighCharts1(data);
			initHighCharts2(data);
			createAllContent1(data);
		},
		error:function(XMLHttpRequest, textStatus, errorThrown){
		}
	});
}
//采集饼状图
function initHighCharts(data){
	 
	var cjdcjTotal=0;
		var cjdshTotal=0;
		var cjyshTotal=0;
		var cxcjTotal=0;
		for(var i=0;i<data.length;i++){
			cjdcjTotal+=data[i].cjdcjTotal;
			cjdshTotal+=data[i].cjdshTotal;
			cjyshTotal+=data[i].cjyshTotal;
	   		cxcjTotal+=data[i].cxcjTotal;
		}
	  $('#wfsx').highcharts({
		chart: {
			plotBackgroundColor: null,
			plotBorderWidth: null,
			plotShadow: false
		},
		title: { text: '档案采集' }, 
		tooltip: { 
			 pointFormat: '{series.name}: <b>{point.y}条</b>'
		},
		plotOptions: { 
			pie: {
               allowPointSelect: true,
               cursor: 'pointer',
               dataLabels: {
                   enabled: false
               },
               showInLegend: true
           }
		},
	    credits:{
	       	text: '',
           	href: ''
	    },
	    exporting:{
	        enabled: false
	    },
		series: [{ 
			type: 'pie', 
			name: '数量', 
			data: [['待采集',cjdcjTotal],
                   ['待审核',cjdshTotal],
			         ['已审核',cjyshTotal],
			         ['重采集',cxcjTotal]]
		}] 
    }); 
} 
//采集饼状图
function initHighCharts1(data){
	 var xzdshTotal=0
	 var xzyshTotal=0;
	 var xzbtgTotal=0;
		for(var i=0;i<data.length;i++){
		    xzdshTotal+=data[i].xzdshTotal;
		    xzyshTotal+=data[i].xzyshTotal;
	    	xzbtgTotal+=data[i].xzbtgTotal;
  		}
	$('#wfcj').highcharts({
		chart: { 
			plotBackgroundColor: null,
			plotBorderWidth: null,
			plotShadow: false
		},
		title: { text: '下载申请量统计' }, 
		tooltip: { 
			 pointFormat: '{series.name}: <b>{point.y}条</b>'
		},
		plotOptions: { 
			pie: {
               allowPointSelect: true,
               cursor: 'pointer',
               dataLabels: {
                   enabled: false
               },
               showInLegend: true
           }
		},
	    credits:{
	       	text: '',
           	href: ''
	    },
	    exporting:{
	        enabled: false
	    },
		series: [{ 
			type: 'pie', 
			name: '数量', 
			data: [['待审核',xzdshTotal],
			         ['已审核',xzbtgTotal],
			         ['不通过',xzbtgTotal]]
		}] 
    });
}
//综合统计柱状图
function initHighCharts2(data) {
    var categories = [];
    var seriesData = [];
   // var seriesData1 = [];
    var seriesData2 = [];
    var seriesData3 = [];
    var seriesData4 = [];
    var seriesData5 = [];
    for(var i=0;i<data.length;i++){
     // seriesData1[i] = data[i].total;
      seriesData2[i] = data[i].cjdcjTotal;
      seriesData3[i] = data[i].cjdshTotal;
      seriesData4[i] = data[i].cjyshTotal;
      seriesData5[i] = data[i].cxcjTotal;
      categories[i] = data[i].bmmc;
    }
    seriesData=[/* {name: '总量', data: seriesData1} */
       {name: '待采集量', data: seriesData2}
      ,{name: '采集待审核量', data: seriesData3}
      ,{name: '采集已审核', data: seriesData4}
      ,{name: '重新采集量', data: seriesData5}];

    $('#container2').highcharts({
      chart: {
        type: 'column'
      },
      exporting: {
    	enabled:false, //去除右上角下载按钮
        filename: '',
        sourceWidth: 1000,
        sourceHeight: 550,
        url: 'http://localhost:<%=request.getLocalPort()%>/HeighChartsExportServlet'
      },
      title: {
        text: '档案采集统计图'
      },
      /* subtitle: {
        text: timeStr,
        x: -20
      }, */
      credits: {
        enabled: false
      },
      xAxis: {
        categories: categories,
        labels: {
          rotation: -45
        }
      },
      yAxis: {
        min: 0,
        title: {
          text: '采集数量'
        }
      },
      tooltip: {
        headerFormat: '<span style="font-size:12px">{point.key}</span><table>',
        pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
        '<td style="padding:0"><b>{point.y} 条</b></td></tr>',
        footerFormat: '</table>',
        shared: true,
        useHTML: true
      },
      plotOptions: {
        column: {
          pointPadding: 0.2,
          borderWidth: 0
        }
      },
      series: seriesData
    });
  }
//创建表格内容
function createAllContent1(data){
	$("#InfoTable1 tbody").empty();//清空原始数据
	var tableBodyStr = "";
	if(data==""){
		tableBodyStr+="";
	}else{
		$.each(data,function(i,n){
			//tableBodyStr+="<tr onclick=\"checkTp1(this)\" tpurl=\""+n.tpurl+"\">";
			tableBodyStr+="<tr>";
			if(i%2==0){
				tableBodyStr+="<td height=\"28\" class=\"dashujutable_nr1\"  align=\"center\" style=\"width: 238px\">"+n.bmmc+"</td>";
				tableBodyStr+="<td class=\"dashujutable_nr1\" align=\"center\">"+n.cjdcjTotal+"</td>";
				tableBodyStr+="<td class=\"dashujutable_nr1\" align=\"center\" style=\"width: 238px\">"+n.cjyshTotal+"</td>";
				tableBodyStr+="<td class=\"dashujutable_nr1\" align=\"center\">"+n.xzdshTotal+"</td>";
				tableBodyStr+="<td class=\"dashujutable_nr1\" align=\"center\" style=\"width: 100px\">"+n.cxcjTotal+"</td>";
			}else{
				tableBodyStr+="<td height=\"28\" class=\"dashujutable_nr2\"  align=\"center\">"+n.bmmc+"</td>";
				tableBodyStr+="<td class=\"dashujutable_nr2\" align=\"center\">"+n.cjdcjTotal+"</td>";
				tableBodyStr+="<td class=\"dashujutable_nr2\" align=\"center\" style=\"width: 238px\">"+n.cjyshTotal+"</td>";
				tableBodyStr+="<td class=\"dashujutable_nr2\" align=\"center\">"+n.xzdshTotal+"</td>";
				tableBodyStr+="<td class=\"dashujutable_nr2\" align=\"center\" style=\"width: 100px\">"+n.cxcjTotal+"</td>";
			}
			tableBodyStr+="</tr>";
		});
	}	
	$("#InfoTable1 tbody").html(tableBodyStr);
	//表格变颜色	
	$(".dashujutable>tbody>tr").hover(
	  function () {
	    $(this).children(".dashujutable_nr1").css({background:"#cee4ff"});
	  },
	  function () {
		 $(this).children(".dashujutable_nr1").css({background:"#ffffff"});
	  }
	);
	$(".dashujutable>tbody>tr").hover(
	  function () {
	    $(this).children(".dashujutable_nr2").css({background:"#cee4ff"});
	  },
	  function () {
		 $(this).children(".dashujutable_nr2").css({background:"#f1f1f1"});
	  }
	);
}

</script>
<!--系统头部中间内容区域end-->
</body>
</html>